This repository has no description
semble
/
src
/
webapp
/
app
/
(dashboard)
/
profile
/
[handle]
/
(withoutHeader)
/
collections
/
[collectionId]
/
opengraph-image.tsx
1.8 kB
70 lines
1import { ApiClient } from '@/api-client';
2import { createClientTokenManager } from '@/services/auth';
3import OpenGraphCard from '@/features/openGraph/components/openGraphCard/OpenGraphCard';
4import { truncateText } from '@/lib/utils/text';
5
6interface Props {
7 params: Promise<{ collectionId: string }>;
8}
9
10export const contentType = 'image/png';
11export const size = {
12 width: 1200,
13 height: 630,
14};
15
16export default async function Image(props: Props) {
17 const { collectionId } = await props.params;
18
19 const apiClient = new ApiClient(
20 process.env.NEXT_PUBLIC_API_BASE_URL || 'http://localhost:3000',
21 createClientTokenManager(),
22 );
23
24 const collection = await apiClient.getCollectionPage(collectionId);
25
26 return await OpenGraphCard({
27 children: (
28 <div style={{ display: 'flex', flexDirection: 'column' }}>
29 <div
30 style={{
31 display: 'flex',
32 flexDirection: 'column',
33 gap: 10,
34 marginTop: '35px',
35 }}
36 >
37 <p
38 style={{
39 fontSize: '40px',
40 lineHeight: '20px',
41 color: '#e803ff',
42 }}
43 >
44 Collection
45 </p>
46 <p
47 style={{
48 fontSize: '64px',
49 lineHeight: '20px',
50 }}
51 >
52 {truncateText(truncateText(collection.name), 35)}
53 </p>
54 <p
55 style={{
56 fontSize: '40px',
57 lineHeight: '20px',
58 marginTop: '40px',
59 }}
60 >
61 <span>By </span>
62 <span style={{ color: '#23AFED' }}>
63 @{truncateText(truncateText(collection.author.handle), 35)}
64 </span>
65 </p>
66 </div>
67 </div>
68 ),
69 });
70}